/**
 * MineAdmin is committed to providing solutions for quickly building web applications
 * Please view the LICENSE file that was distributed with this source code,
 * For the full copyright and license information.
 * Thank you very much for using MineAdmin.
 *
 * @Author X.Mo<root@imoi.cn>
 * @Link   https://github.com/mineadmin
 */
import type { MaProTableColumns, MaProTableExpose } from "@mineadmin/pro-table";
import type { UseDialogExpose } from "@/hooks/useDialog.ts";

import defaultAvatar from "@/assets/images/defaultAvatar.jpg";
import { ElTag } from "element-plus";
import { h, ref, onMounted } from "vue";
import { useMessage } from "@/hooks/useMessage.ts";
import { ResultCode } from "@/utils/ResultCode.ts";
import hasAuth from "@/utils/permission/hasAuth.ts";
import { deleteByIds } from "$/attractions/attraction-management/api/attractionInfo.ts";
import {
  attractionStatus,
  infoGroup,
} from "$/attractions/attraction-management/views/attractionInfo/data/common.tsx";
import { getAll as getAllType } from "$/attractions/attraction-management/api/attractionType.ts";
import { getAll as getAllSpot } from "$/attractions/attraction-management/api/attractionSpot.ts";

export default function getTableColumns(
  dialog: UseDialogExpose,
  formRef: any,
  t: any
): MaProTableColumns[] {
  const msg = useMessage();
  
  // 创建一个响应式的类型列表
  const typeList = ref<any[]>([]);
  
  // 创建一个响应式的点位列表
  const spotList = ref<any[]>([]);
  
  // 获取类型列表
  onMounted(async () => {
    try {
      const response = await getAllType();
      if (response.code === 200 && response.data && response.data.list) {
        typeList.value = response.data.list;
      }
    } catch (error) {
      console.error('获取类型列表失败:', error);
    }
  });

  // 获取点位列表
  onMounted(async () => {
    try {
      const response = await getAllSpot();
      if (response.code === 200 && response.data && response.data.list) {
        spotList.value = response.data.list;
      }
    } catch (error) {
      console.error('获取点位列表失败:', error);
    }
  });

  return [
    {
      type: "selection",
      showOverflowTooltip: false,
      label: () => t("crud.selection"),
    },
    { label: "标题", prop: "title" },
    {
      label: "信息分组",
      prop: "group",
      cellRender: ({ row }) => {
        const groupItem = infoGroup.find((item) => item.value === row.group);
        if (!groupItem) return row.group;

        const tagType =
          groupItem.color === "primary"
            ? "primary"
            : groupItem.color === "success"
            ? "success"
            : groupItem.color === "info"
            ? "info"
            : "info";

        return h(ElTag, { type: tagType }, () => groupItem.label);
      },
    },
    {
      label: "类型",
      prop: "type_id",
      cellRender: ({ row }) => {
        // 根据 type_id 查找对应的类型名称
        const typeItem = typeList.value.find((item) => item.id === row.type_id);
        return typeItem ? typeItem.name : `未知类型(${row.type_id})`;
      },
    },
    {
      label: "点位",
      prop: "spot_id",
      cellRender: ({ row }) => {
        // 根据 spot_id 查找对应的点位名称
        const spotItem = spotList.value.find((item) => item.id === row.spot_id);
        return spotItem ? (spotItem.name || `点位${spotItem.id}`) : `未知点位(${row.spot_id})`;
      },
    },
    {
      label: "显示状态",
      prop: "status",
      cellRender: ({ row }) => {
        const statusItem = attractionStatus.find(
          (item) => item.value === row.status
        );
        if (!statusItem) return row.status;

        const tagType =
          statusItem.color === "primary"
            ? "primary"
            : statusItem.color === "danger"
            ? "danger"
            : statusItem.color === "warning"
            ? "warning"
            : "info";

        return h(ElTag, { type: tagType }, () => statusItem.label);
      },
    },
    { label: "排序", prop: "sort" },
    { label: "开始时间", prop: "start_time", mode: "date", showTime: true },
    { label: "结束时间", prop: "end_time", mode: "date", showTime: true },
    {
      type: "operation",
      label: () => t("crud.operation"),
      operationConfigure: {
        actions: [
          {
            name: "edit",
            icon: "material-symbols:person-edit",
            show: ({ row }) => hasAuth("attraction_info:attractionInfo:update"),
            text: () => t("crud.edit"),
            onClick: ({ row }) => {
              dialog.setTitle(t("crud.edit"));
              dialog.open({ formType: "edit", data: row });
            },
          },
          {
            name: "del",
            icon: "mdi:delete",
            text: () => t("crud.delete"),
            show: ({ row }) => hasAuth("attraction_info:attractionInfo:delete"),
            onClick: ({ row }, proxy: MaProTableExpose) => {
              msg.delConfirm(t("crud.delDataMessage")).then(async () => {
                const response = await deleteByIds([row.id]);
                if (response.code === ResultCode.SUCCESS) {
                  msg.success(t("crud.delSuccess"));
                  proxy.refresh();
                }
              });
            },
          },
        ],
      },
    },
  ];
}
